// =============================================================================
// 核心框架和根组件 (Core Framework & Root Component)
// =============================================================================
import { createApp } from 'vue';
import App from './App.vue';

// =============================================================================
// 核心插件: 状态管理和路由 (Core Plugins: State Management & Routing)
// =============================================================================
import { createPinia } from 'pinia';
import router from './router';
// =============================================================================
// UI 库 (UI Library)
// =============================================================================
import ElementPlus from 'element-plus';
import 'element-plus/dist/index.css'; // 引入 Element Plus 的全局样式
// 导入插件生成的 virtual module，它会处理所有 SVG 的注册
import 'virtual:svg-icons-register'
// 导入你刚创建的 SvgIcon 组件
import SvgIcon from '@/components/SvgIcon/index.vue'
// =============================================================================
// 全局样式 (Global Styles)
// 注意：请确保你已经将旧项目的 SCSS 文件复制到了新项目的 src/styles 目录下
// =============================================================================
import '@/styles/index.scss';
// import '@/styles/home.scss'; // 如果需要，可以逐个取消注释
// import '@/styles/newRJWMsystem.scss';
// import '@/styles/icon/iconfont.css';

// =============================================================================
// 数据可视化库 (Data Visualization Library)
// =============================================================================
import * as echarts from 'echarts';
import * as ElementPlusIconsVue from '@element-plus/icons-vue';
// =============================================================================
// 权限控制 (Permission Control)
// 注意：这个文件需要在 router 注册之后被引入，以确保路由守卫能正常工作
// =============================================================================
import './permission'; // 引入路由守卫逻辑

// =============================================================================
// 创建 Vue 应用实例 (Create Vue App Instance)
// =============================================================================
const app = createApp(App);
// --- 2. 循环注册所有图标为全局组件 ---
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component);
}
// =============================================================================
// 注册插件 (Use Plugins)
// 注册顺序通常是：状态管理 -> 路由 -> UI库
// =============================================================================
app.use(createPinia());
app.use(router);
app.use(ElementPlus);
app.component('SvgIcon', SvgIcon)
// =============================================================================
// 全局属性挂载 (Global Properties)
// 在 Vue 3 中，通过 app.config.globalProperties 来添加全局变量
// 这样在组件的 <script setup> 中可以通过 `getCurrentInstance().appContext.config.globalProperties` 访问，
// 在 Options API 中仍然可以通过 `this.$echarts` 访问。
// =============================================================================
app.config.globalProperties.$echarts = echarts;

// 注意：像 moment 这样的工具库，在 Vue 3 中更推荐在需要它的组件里单独导入，
// 而不是挂载到全局。这有利于代码维护和 Tree Shaking (打包优化)。
// import moment from 'moment';
// app.config.globalProperties.$moment = moment;

// =============================================================================
// 挂载应用 (Mount App)
// 这一步必须在最后执行
// =============================================================================
app.mount('#app');
